<template>
    <view style="height: 100%">
        <!-- marketing/pages/promotion/apply/apply.wxml -->
        <form @submit="submit">
            <view class="apply_wrap">
                <view class="desc" v-if="detailInfo.auditStatus == 0">您的信息正在审核中...</view>
                <view class="desc" v-if="detailInfo.auditStatus === 2">您的信息审核不通过，请修改后再提交</view>
                <view class="box" v-if="detailInfo.auditStatus === 2">
                    <view class="box_title flex-row-start" v-if="detailInfo.auditStatus === 2">
                        <text>审核不通过原因</text>
                        <image class="bg" src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/bg-1.png"></image>
                    </view>
                    <view class="box__desc">{{ detailInfo.auditRefuseReason }}</view>
                </view>

                <view class="apply_form">
                    <image class="sh-img" src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/sx.png" v-if="detailInfo.auditStatus == '0'"></image>
                    <image class="sh-img" src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/sx-no.png" v-if="detailInfo.auditStatus === 2"></image>
                    <view class="form_item flex-row-start">
                        <view class="item_title flex-row-start">
                            <text>*</text>
                            姓名
                        </view>
                        <input :value="detailInfo.plUserName" class="item_input flex_1" disabled />
                    </view>
                    <view class="form_item flex-row-start">
                        <view class="item_title flex-row-start">
                            <text>*</text>
                            手机号码
                        </view>
                        <input class="item_input flex_1" :value="detailInfo.plUserPhone" disabled />
                    </view>
                    <view class="form_item flex-row-start" v-if="detailInfo.areaName">
                        <view class="item_title flex-row-start">
                            <!-- <text>*</text> -->
                            推广地区
                        </view>
                        <input class="item_input flex_1" :value="detailInfo.areaName" disabled />
                        <!-- <picker class="item_input flex_1" mode="region" bindchange="bindRegionChange" level="sub-district" value="{{region}}" custom-item="{{customItem}}">
                    <input class="item_input flex_1" value="{{form.region}}" disabled name='region' placeholder="请选择推广地区" type="text" />
                </picker> -->
                    </view>
                    <view class="form_item flex-row-start" v-if="detailInfo.applyCreditNo">
                        <view class="item_title flex-row-start">
                            <!-- <text>*</text> -->
                            身份证号码
                        </view>
                        <input class="item_input flex_1" :value="detailInfo.applyCreditNo" disabled />
                    </view>

                    <!-- <view class="upload_wrap flex-row-start flex_wrap">
                <view class="upload_item flex-row-center">
                    <image class="img" src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/ids1.png"></image>
                    <view class="flex-column-start">
                        <van-uploader>
                            <van-button icon="photo" type="primary">
                                <image src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/update.png" class="update"></image>
                            </van-button>
                        </van-uploader>
                        <view class="up_text">上传身份证正面</view>
                    </view>
                </view>

                <view class="upload_item flex-row-center">
                    <image class="img" src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/ids'0'.png"></image>
                    <view class="flex-column-start">
                        <van-uploader>
                            <van-button icon="photo" type="primary">
                                <image src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/update.png" class="update"></image>
                            </van-button>
                        </van-uploader>
                        <view class="up_text">上传身份证反面</view>
                    </view>
                </view>

                <view class="upload_item flex-row-center">
                    <image src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/delete.png" class="delete"></image>
                    <image class="img" src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/ids'0'.png"></image>
                    <view class="flex-column-start">
                        <van-uploader>
                            <van-button icon="photo" type="primary">
                                <image src="https://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/update.png" class="update"></image>
                            </van-button>
                        </van-uploader>
                        <view class="up_text">上传个人照片</view>
                    </view>

                </view>
            </view> -->
                </view>
            </view>
            <view class="btn_wrap flex-row-center" v-if="detailInfo.auditStatus === 2">
                <button class="btn flex-row-center" type="primary" formType="submit" @tap="applyAgain">重新申请</button>
            </view>
        </form>
    </view>
</template>

<script lang="ts">
// import zpMixins from '@/uni_modules/zp-mixins/index';
// import vanUploader from './@vant/weapp/uploader/index';
// marketing/pages/promotion/apply/apply.ts
var promotion_1 = require("../../../../api/marketing/promotion");
// import { auditDetail } from '../../../../api/marketing/promotion';
export default {   
    data() {
        return {
            detailInfo: {
                auditStatus: '',
                auditRefuseReason: '',
                plUserName: '',
                plUserPhone: '',
                areaName: '',
                applyCreditNo: ''
            }
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad() {},
    onShow() {
        this.getAuditDetail();
    },
    methods: {
        async getAuditDetail() {
            promotion_1.auditDetail({
                plUserId: uni.getStorageSync('memberId')
            }).then((res) => {
                const { code, data }: any = res;
                // 审核状态：0：待审核；1：审核通过；2：审核拒绝
                if (code == 200) {
                    if (data.applyCreditNo) {
                        data.applyCreditNo = data.applyCreditNo.replace(data.applyCreditNo.substring(2, 17), '**************');
                    }
                    this.setData({
                        detailInfo: data
                    });
                }
            });
        },

        // 重新申请
        applyAgain() {
            const { plUserName, plUserPhone, areaName }: any = this.detailInfo;
            uni.setStorageSync(
                'applyAgainInfo',
                JSON.stringify({
                    plUserName,
                    plUserPhone,
                    areaName
                })
            );
            uni.navigateTo({
                url: '/marketing_page/pages/promotion/apply/apply'
            });
        },

        submit() {
            console.log('占位：函数 submit 未声明');
        }
    }
}
</script>
<style lang="less" >
	@import "../../../../commin/flex.less";
	@import "../../../../commin/commin.less";
/* marketing/pages/promotion/apply/apply.wxss */
/*数字*/
/*固定布局*/
/*宽高*/
/* 行高 */
/* 外边距 */
/* 实边框 */
/* 定位  */
.record-in .aaa1 {
    color: #909399;
}
.record-in .aaa2 {
    color: #1487fa;
}
.record-in .aaa3 {
    color: #f7a14a;
}
.record-in .aaa4 {
    color: #72c23d;
}
.record-in .aaa5 {
    color: #606266;
}
page {
    background-color: #f5f7fa;
}
.arrows_r {
    width: 16rpx;
    height: 16rpx;
    border-top: 1px solid #5a3e3e;
    border-right: 1px solid #5a3e3e;
    transform: rotate(45deg);
}
.apply_wrap {
    padding: 40rpx 24rpx;
}
.apply_wrap .desc {
    font-size: 26rpx;
    color: #303133;
    margin-bottom: 24rpx;
}
.apply_form {
    background: linear-gradient(0deg, #ffffff, #f4f6f8);
    border: 2rpx solid #ffffff;
    box-shadow: 4rpx 7rpx 20rpx 0px rgba(166, 171, 179, 0.24);
    border-radius: 16rpx;
    padding: 0 32rpx;
    font-size: 28rpx;
    position: relative;
}
.apply_form .sh-img {
    position: absolute;
    right: 0;
    width: 175rpx;
    height: 138rpx;
    top: 52rpx;
    right: 32rpx;
}
.apply_form .form_item {
    height: 111rpx;
    border-bottom: 1rpx solid #dcdfe6;
}
.apply_form .form_item:last-child {
    border: 0;
}
.apply_form .form_item .picker {
    height: 100rpx;
    width: 100%;
}
.apply_form .item_title {
    width: 220rpx;
}
.apply_form .item_title text {
    color: #fc724c;
}
.apply_form .upload_wrap {
    padding: 35rpx 0;
}
.apply_form .upload_wrap .update {
    width: 72rpx;
    height: 72rpx;
}
.apply_form .upload_wrap .up_text {
    font-size: 24rpx;
    color: #606266;
    margin-top: 10rpx;
}
.apply_form .upload_wrap .upload_item {
    width: 306rpx;
    margin-right: 14rpx;
    height: 190rpx;
    margin-bottom: 14rpx;
    position: relative;
    border: 1rpx dashed #e2e6ed;
    border-radius: 12rpx;
    z-index: 1;
}
.apply_form .upload_wrap .upload_item .delete {
    width: 29rpx;
    height: 29rpx;
    right: 0;
    top: 0;
    position: absolute;
}
.apply_form .upload_wrap .upload_item:nth-child(2) {
    margin-right: 0;
}
.apply_form .upload_wrap .upload_item .img {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    filter: blur(2px);
}
.btn_wrap {
    width: 100%;
    height: 120rpx;
    background: #ffffff;
    position: fixed;
    bottom: 0;
    left: 0;
}
.btn_wrap .btn {
    width: 686rpx;
    height: 88rpx;
    background: linear-gradient(105deg, #268ae8, #1487fa);
    box-shadow: 0px 3rpx 6rpx 0rpx rgba(0, 110, 212, 0.3);
    border-radius: 44rpx;
    font-size: 30rpx;
    font-weight: bold;
    color: #ffffff;
}
.box {
    background: linear-gradient(0deg, #ffffff, #f4f6f8);
    box-shadow: 4rpx 7rpx 20rpx 0rpx rgba(166, 171, 179, 0.24);
    border-radius: 16rpx;
    padding: 0 32rpx 40rpx 32rpx;
    margin-bottom: 16rpx;
    border: 2rpx solid #ffffff;
}
.box .box_title {
    width: 341rpx;
    height: 90rpx;
    position: relative;
    left: -38rpx;
    top: -10rpx;
}
.box .box_title text {
    font-size: 32rpx;
    font-weight: bold;
    color: #ffffff;
    position: absolute;
    z-index: 1;
    margin-left: 38rpx;
}
.box .box_title .bg {
    width: 100%;
    height: 100%;
    position: absolute;
}
.box .box__desc {
    font-size: 28rpx;
    color: #606266;
    margin-top: 20rpx;
    .yiman(10)
}
</style>
